<template>
  <div>
    <div class="el-card__body">
      <i data-v-7f1d229e="" class="el-icon-tickets"></i>
      <span data-v-7f1d229e="">发货列表</span>
    </div>
    <div class="tableclass">
      <el-form label-width="80px">
        <el-table :data="table" border style="width: 100%">
          <el-table-column prop="number" label="订单编号"> </el-table-column>
          <el-table-column prop="consignee" label="收货人"> </el-table-column>
          <el-table-column prop="phone" label="手机号码"> </el-table-column>
          <el-table-column prop="address" label="收货地址"> </el-table-column>
          <el-table-column label="外卖方式" prop="express">
            <template slot-scope="scope">
              <el-select
                v-model="scope.row.express"
                placeholder="请选择"
                clearable
              >
                <el-option label="美团" value="1"></el-option>
                <el-option label="饿了么" value="2"></el-option>
              </el-select>
            </template>
          </el-table-column>
        </el-table>
        <el-form-item>
          <el-button type="primary" @click="onSubmit">发货</el-button>
          <el-button @click="out">取消</el-button>
        </el-form-item>
      </el-form>
    </div>
  </div>
</template>

<script>
import { selectOrdersById, uodateOrders } from "../../api/order";
export default {
  data() {
    return {
      table: [],
      form: {},
    };
  },
  methods: {
    async selectbyid(id) {
      let result = await selectOrdersById(id);
      this.form = result.data.order;
      this.table.push(this.form);
    },
    onSubmit() {
      this.form = this.table[0];
      this.updateorder(this.form);
    },
    async updateorder(form) {
      var $this = this;
      let result = await uodateOrders(form);
      console.log(result);
      if (result.data.code === 200) {
        //弹出消息
        $this.$message({
          message: "修改成功",
          type: "success",
          duration: 2000,
        });
        this.$router.push({ name: "order" });
      }
    },
    out() {
      this.$router.push({ name: "order" });
    },
  },
  created() {
    var id = this.$route.params.id;
    this.selectbyid(id);
  },
};
</script>

<style lang="less" scoped>
.el-card__body {
  border: 1px solid #cccc;
  border-radius: 15px;
}
</style>